<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="http://at.alicdn.com/t/font_2011960_drlq7vdo6.css">
    <link rel="stylesheet" href="/css/modules/header.css">
    <link rel="stylesheet" href="/css/shop.css">
    <link rel="stylesheet" href="/css/modules/footer.css">
</head>
<body>
  <header></header>
  <div><a href="/html/detail.html?id=3">继续购物</a>&gt;<a href="/index.html">首页</a></div>
  <div class="fly"><i class="iconfont icon-shuidi"></i>购物袋<span class="zongshop1">0</span></div>
    <div class="shop-content">
        <script type="text/html" id="shop-content-template">
        
      <div class="shop-left">
        <div class="left-img">
            <!-- <li><img src="../img/shop/c1.png" alt=""></li>
            <li><img src="../img/shop/c2.png" alt=""></li>
            <li><img src="../img/shop/c3.png" alt=""></li>
            <li><img src="../img/shop/c4.png" alt=""></li>
            <li><img src="../img/shop/c3.png" alt=""></li> -->
            
           <ul id="gall">
            <li>
              <a class="zoomGalleryActive" href="javascript:;" data-image="{{photo[0].url}}">
                  <img src="{{photo[0].url}}" class="smallpic">
              </a>
          </li>
          {{each photo.slice(1,5) shop}}
          <li>
              <!-- data-image设置中图路径，data-zoom-image设置大图的路径 -->
              <!-- 如果中图和大图是同一张，那么data-zoom-image可以不写 -->
              <a href="javascript:;" data-image="{{shop.url}}" data-zoom-image="{{shop.url}}">
                  <img src="{{shop.url}}" class="smallpic">
              </a>
          </li>
          {{/each}}
           </ul>
          
        </div>
        <div class="right-img"><li><img src="{{photo[0].url}}" class="zoom-image"></li></div>
      </div>
      <div class="shop-right">
       
          <h1>{{title}}</h1>
          <h2>DESIGNER LIFT FOUNDATION</h2>
          <div class="ping">
            <div class="star">
                <li><i class="iconfont icon-star"></i></li>
                <li><i class="iconfont icon-star"></i></li>
                <li><i class="iconfont icon-star"></i></li>
                <li><i class="iconfont icon-star"></i></li>
                <li><i class="iconfont icon-star"></i></li>
              </div>
              <a>共一条评论</a>
            </div>
          <p>从时装到美妆，阿玛尼实验室用专研科技创造出一种颠覆乳霜厚重感的丝滑细腻的大师造型粉底乳。这种顺滑如丝绸般的质感，不仅使肌肤看起来柔滑无瑕，还能强调</p>
         <ul>
            <li><img src="../img/index/ys1.jpg" alt=""></li>
            <li><img src="../img/index/ys2.jpg" alt=""></li>
            <li><img src="../img/index/ys3.jpg" alt=""></li>
            <li><img src="../img/index/ys4.jpg" alt=""></li>
            <li><img src="../img/index/ys5.jpg" alt=""></li>
            <li><img src="../img/index/ys6.jpg" alt=""></li>

         </ul>
          <div class="right-select">
              <select>
                  <option value=""><img src="../img/index/ys1.jpg" alt=""> #304正红</option>
                  <option value="">#33正红</option>
                  <option value="">#3304恒红红</option>
              </select>
          </div>
          <div class="purchse">
              <span>￥{{price}}</span>
            <button class="add-cart">加入购物袋</button>
            <a href="/html/cart.html"><button>立即购买</button></a>
          </div>
         </div>
      </div>
     
    </script>
    </div>
    <footer></footer>
    <script src="/libs/require.js" data-main="/js/shop.js"></script>
</body>
</html>